<!DOCTYPE html>
<html>
<head>
<include file="Include:meta" />
<title>项目人员管理-目的地运营集团数据管理平台</title>
<include file="Include:style" />
<style>
	#modal-clear.opacity{ opacity: 1; z-index: 1052; background: rgba(0,0,0,0.5); }
	.noborder{ border-bottom: none; }
</style>
</head>
<body>
<include file="Include:header" />
<include file="Include:left" />
<div id="main">
	<div class="seat_map">
		<div class="scale">
			<div class="fix_map">
				<img class="map" src="__PUBLIC__/images/seat.jpg" alt="">
				<div class="touch_cont touch_1">
					<p class="s607">607</p>
					<p class="s603">603</p>
					<p class="s604">604</p>
					<ul>
						<foreach name="seat1" item="vo">
							<if condition="$ck eq 1">
								<li class="det seat {$vo['seat_id']}" uid="{$vo['u_id']}" mid="{$vo['id']}"><a href='javascript:;'><span>{$vo['span']}</span></a><em>{$vo['users']}</em></li>
							<else/>
								<li class="det seat {$vo['seat_id']}" uid="{$vo['u_id']}" mid="{$vo['id']}"><span>{$vo['span']}</span><em>{$vo['users']}</em></li>
							</if>
						</foreach>
					</ul>
					<foreach name="ss1" item="vo">
						<if condition="$ck eq 1">
							<div class="det room {$vo['seat_id']}" uid="{$vo['id']}" mid="{$vo['sid']}"><if condition="$vo['em'] eq 1"><em>{$vo['users']}</em></if></div>
						<else/>
							<div class="det room default {$vo['seat_id']}" uid="{$vo['id']}" mid="{$vo['sid']}"><if condition="$vo['em'] eq 1"><em>{$vo['users']}</em></if></div>
						</if>
					</foreach>
					<div class="touch_mask"></div>
				</div>
				<div class="touch_cont touch_2">
					<p class="s602">602</p>
					<p class="s601">601</p>
					<p class="s11">会议室</p>
					<p class="shuike">会客区</p>
					<p class="sA6">打印区</p>
					<ul>
						<foreach name="seat2" item="vo">
							<if condition="$ck eq 1">
								<li class="det seat {$vo['seat_id']}" uid="{$vo['u_id']}" mid="{$vo['id']}"><a href='javascript:;'><span>{$vo['span']}</span></a><em>{$vo['users']}</em></li>
							<else/>
								<li class="det seat {$vo['seat_id']}" uid="{$vo['u_id']}" mid="{$vo['id']}"><span>{$vo['span']}</span><em>{$vo['users']}</em></li>
							</if>
						</foreach>
					</ul>
					<foreach name="ss2" item="vo">
						<if condition="$ck eq 1">
							<div class="det room {$vo['seat_id']}" uid="{$vo['id']}" mid="{$vo['sid']}"><if condition="$vo['em'] eq 1"><em>{$vo['users']}</em></if></div>
						<else/>
							<div class="det room default {$vo['seat_id']}" uid="{$vo['id']}" mid="{$vo['sid']}"><if condition="$vo['em'] eq 1"><em>{$vo['users']}</em></if></div>
						</if>
					</foreach>
					<div class="touch_mask"></div>
				</div>
				<div class="touch_cont touch_3">
					<p class="sA4">打印区</p>
					<p class="s605">605</p>
					<p class="s22">会议室</p>
					<p class="s606">606</p>
					<ul>
						<foreach name="seat3" item="vo">
							<if condition="$ck eq 1">
								<li class="det seat {$vo['seat_id']}" uid="{$vo['u_id']}" mid="{$vo['id']}"><a href='javascript:;'><span>{$vo['span']}</span></a><em>{$vo['users']}</em></li>
							<else/>
								<li class="det seat {$vo['seat_id']}" uid="{$vo['u_id']}" mid="{$vo['id']}"><span>{$vo['span']}</span><em>{$vo['users']}</em></li>
							</if>
						</foreach>
					</ul>
					<foreach name="ss3" item="vo">
						<if condition="$ck eq 1">
							<div class="det room {$vo['seat_id']}" uid="{$vo['id']}" mid="{$vo['sid']}"><if condition="$vo['em'] eq 1"><em>{$vo['users']}</em></if></div>
						<else/>
							<div class="det room default {$vo['seat_id']}" uid="{$vo['id']}" mid="{$vo['sid']}"><if condition="$vo['em'] eq 1"><em>{$vo['users']}</em></if></div>
						</if>
					</foreach>
					<div class="touch_mask"></div>
				</div>
			</div>
		</div>
		<div class="name_btn">显示<br/>姓名</div>
	</div>
</div>
<!--弹框-->
<div class="modal fade all_inp" id="seat-modal">
	<div class="modal-dialog w800">
		<div class="modal-content">
			<div class="modal-header">
				<h4>座位信息</h4>
				<i class="fa fa-times" aria-hidden="true" data-dismiss="modal"></i>
			</div>
			<form class="in_form" method="post" name="number_validate" novalidate="novalidate">
			<div class="modal-body" style="line-height:30px;">
				<div class="form-main">
					<div class="form-item">
						<div class="input-label">区位名称</div>
						<div class="input-item"><span class="name"></span></div>
					</div>
					<div class="form-item ush">
						<div class="input-label">座位编号</div>
						<div class="input-item"><span class="bid"></span>
							<if condition="$zw eq 1">
							<div class="select right">
								<b class="mr10">座位调换</b>
								<select name="nu_id" class="w200"></select>
							</div>
							</if>
						</div>
					</div>
					<div class="form-item ush">
						<div class="input-label">姓名</div>
						<div class="input-item"><span class="user"></span></div>
					</div>
					<div class="form-item null">
						<div class="input-label">IT类固资</div>
						<div class="input-item">
							<div class="checkbox-item it_check">
								
							</div>
						</div>
					</div>
					<div class="form-item null">
						<div class="input-label">行政固资</div>
						<div class="input-item">
							<div class="checkbox-item xz_check">
								
							</div>
						</div>
					</div>
					<div class="form-item null">
						<div class="input-label">其它</div>
						<div class="input-item">
							<span class="other"></span>
						</div>
					</div>
					<div class="form-item null">
						<div class="input-label">备注</div>
						<div class="input-item">
							<span class="remark"></span>
						</div>
					</div>
				</div>
			</div>
			<if condition="$zw eq 1">
				<div class="modal-footer">
					<button type="button" class="btn btn-clear left">清空</button><button type="button" class="btn btn-affirm hide">确认</button><button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				</div>
			</if>
			</form>
		</div>
	</div>
</div>
<!-- 清空 -->
<div class="modal fade" id="modal-clear" >
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4>确认提示框</h4>
				<i class="fa fa-times" aria-hidden="true" data-dismiss="modal"></i>
			</div>
			<div class="modal-body">您确定要清空座位信息吗？</div>
			<div class="modal-footer">
				<button type="button" class="btn clear-confirm">确认</button>
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
<include file="Include:javascript" />
<script type="text/javascript">
	$(function() {
		var zw="{$zw}";
		var ck="{$ck}";
		//清空
		$('.btn-clear').click(function(){
			var uid = $(this).siblings('.btn-affirm').attr('uid'),
				mid = $(this).siblings('.btn-affirm').attr('mid');
			$('.clear-confirm').attr('uid',uid);
			$('.clear-confirm').attr('mid',mid);
			$('#modal-clear').fadeIn().addClass('opacity');
		})
		$('.clear-confirm').click(function(){
			var uid = $(this).attr('uid'),
				mid = $(this).attr('mid');
			$.ajax({
				type:"POST",
				async:false,
				dataType:"json",
				data:{"u_id":uid,"mid":mid,"action":"clear"},
				url:"__APP__/Administration/seat_map_ajax",
				success:function(data){
					success_pop(data.status,data.msg);
				}
			})
		})
		$('#modal-clear .btn-default,#modal-clear .fa-times').click(function(){
			$('#modal-clear').fadeOut();
		})

		$('.seat_map').height($(window).height()-50);
		$(window).resize(function(){
			$('.seat_map').height($(window).height()-50);
		})
		//区域1
		$('.touch_cont').click(function(){
			$('.scale').addClass('active');
		})
		$('.touch_1 .touch_mask').click(function(){
			$('.fix_map').removeClass('active_t2').addClass('active_t1');
			$('.touch_2 .touch_mask').show();
			$('.touch_3 .touch_mask').show();
			$(this).hide();
		})
		$('.touch_2 .touch_mask').click(function(){
			$('.fix_map').removeClass('active_t3').removeClass('active_t1').addClass('active_t2');
			$('.touch_1 .touch_mask').show();
			$('.touch_3 .touch_mask').show();
			$(this).hide();
		})
		$('.touch_3 .touch_mask').click(function(){
			$('.fix_map').removeClass('active_t2').addClass('active_t3');
			$('.touch_1 .touch_mask').show();
			$('.touch_2 .touch_mask').show();
			$(this).hide();
		})
		//姓名
		$('.name_btn').click(function(){
			if($(this).hasClass('active')){
				$(this).removeClass('active').html('显示<br/>姓名');
				$('.touch_cont em').fadeOut();
			}else{
				$(this).addClass('active').html('隐藏<br/>姓名');
				$('.touch_cont em').fadeIn();
			}
		})
		//座位
		if(ck==1){
		$(".det").on("click",function(){
			var uid = $(this).attr("uid"),
				mid = $(this).attr("mid"),
				modal = $("#seat-modal");
			modal.find(".btn-affirm").attr({"uid":uid});
			modal.find(".btn-affirm").attr({"mid":mid});
			$('.btn-affirm').hide();
			$.ajax({
				type:"POST",
				async:false,
				dataType:"json",
				data:{"u_id":uid,"mid":mid,"action":"detail"},
				url:"__APP__/Administration/seat_map_ajax",
				success:function(data){
					modal.modal();
					var seat = $('#seat-modal');
					seat.find('.name').html(""+data.region_name+"");
					if(data.detail){
						$('.null,.select,.btn-clear').show();
						$('.form-main').removeClass('noborder');
						if(data.seat_number){
							seat.find('.bid').html(""+data.seat_number+"");
						}
						if(data.detail.other_goods){
							seat.find(".other").html(""+data.detail.other_goods+"");
						}
						if(data.detail.remark){
							seat.find(".remark").html(""+data.detail.remark+"");
						}
						if(data.detail.users){
							$('.ush,.btn-clear').show();
							$('.btn-default').html('取消');
							seat.find(".user").html(""+data.detail.users+"");
							var html = "<option value='-10'>请选择</option>";
							for(var i=0;i<data.zw.length;i++){
								html+= "<option value='"+data.zw[i].id+"' nmid='"+data.zw[i].mid+"'>"+data.zw[i].seat_number+"</option>";
							}
							$("[name='nu_id']").html(html).select2();
						}else{
							$('.ush,.btn-clear,.btn-affirm').hide();
							$('.btn-default').html('关闭');
						}
						if(data.it){
							var ithtml = '';
							for(var i=0;i<data.it.length;i++){
								ithtml+= "<span class='mr10'>"+data.it[i].name+"("+data.it[i].things_sum+")</span>";
							}
							seat.find('.it_check').html(ithtml);
						}else{
							var ithtml = '';
							seat.find('.it_check').html(ithtml);
						}
						if(data.xz){
							var xzhtml = '';
							for(var f=0;f<data.xz.length;f++){
								xzhtml+= "<span class='mr10'>"+data.xz[f].name+"("+data.xz[f].things_sum+")</span>";
							}
							seat.find('.xz_check').html(xzhtml);
						}else{
							var xzhtml = '';
							seat.find('.xz_check').html(xzhtml);
						}
						$('.btn-affirm').attr('date','2');
					}else{
						if(data.seat_number){
							seat.find('.bid').html(""+data.seat_number+"");
						}
						$('.ush,.btn-affirm').show();
						$('.null,.select,.btn-clear').hide();
						$('.form-main').addClass('noborder');
						var html = '';
						if(zw==1){
							if(data.user){
								html+= "<select class='form-control w150' name='select' autocomplete='off'><option value='-10'>请选择</option>";
								for(var i=0;i<data.user.length;i++){
									html+= "<option value='"+data.user[i].id+"'>"+data.user[i].users+"</option>";
								}
							}else{
								html+= "<select class='form-control w150' name='select' autocomplete='off'><option value='-10'>暂无人员可选</option>";
							}
							html+= "</select><span class='error-item'>必填项</span>";
							seat.find(".user").html(html);
							$("[name='select']").select2();
							$('.btn-affirm').attr('date','1');
						}else{
							html+= "暂无人员";
							seat.find(".user").html(html);
						}
					}
				}
			});
		});
		}
		//提交
		$('.btn-affirm').click(function(){
			var tag = true,
				date = $(this).attr('date');
			if(date==1){
				if($("[name='select']").val()==-10){
					tag = false;
					$("[name='select']").nextAll('.error-item').show();
				}
				if(tag){
					var val = $("[name='select']").val();
						mid = $(this).attr('mid');
					$.ajax({
						type:"POST",
						async:false,
						dataType:"json",
						data:{"u_id":val,"mid":mid,"action":"add"},
						url:"__APP__/Administration/seat_map_ajax",
						success:function(data){
							success_pop(data.status,data.msg);
						}
					})
				}
			}else{
				var nu_id = $("[name='nu_id']").val();
					mid = $(this).attr('mid'),
					uid = $(this).attr('uid'),
					nmid = $("[name='nu_id']").find('option:selected').attr('nmid');
				$.ajax({
					type:"POST",
					async:false,
					dataType:"json",
					data:{"nu_id":nu_id,"omid":mid,"u_id":uid,"nmid":nmid,"action":"change"},
					url:"__APP__/Administration/seat_map_ajax",
					success:function(data){
						success_pop(data.status,data.msg);
					}
				})
			}
		})

		$("[name='nu_id']").change(function(){
			var val = $(this).val();
			if(val!=-10){
				$('.btn-affirm').show();
			}else{
				$('.btn-affirm').hide();
			}
		})
		$("body").on("change","[name='select']",function(){
			$(this).nextAll('.error-item').hide();
		})
	});
</script>
</body>
</html>